<template>
	<view class="all">
		<view style="height: var(--status-bar-height);background-color: red;">
			<!-- app状态栏高度占位 -->
		</view>
		<view class="">
			<u-navbar
				title="个人中心"
				@rightClick="rightClick"
				:autoBack="true"
				leftIconSize="40">
			</u-navbar>
		</view>
		<view class="input">
			<u--input
			    placeholder="搜索人名"
				 prefixIcon="search"
				prefixIconStyle="font-size: 30px;color: #909399"
			    border="surround"
				:customStyle="inputStyle"
			    v-model="value"
			    @change="change"
				shape="circle"
				>
				</u--input>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value:'',
				// test: {
				// 	height: '100%',
				// 	padding: '0 0 0 0',
				// 	border: 'none'
				// },
				inputStyle:{
					
					borderBottom: '0.5px  #f6f6f6 solid',
				}
			};
		},
		methods:{
			getHeight(){
				let res = wx.getSystemInfoSync();
				let statusHeight = res.statusBarHeight; // 注意：此时获取到的值的单位为 'px'
				console.log(statusHeight,'statusHeights');
			},
			rightClick() {
			    console.log('rightClick');
			},
			change(e){
				console.log('change', e);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.all{
		height:100vh;
		background: #F7FBFE;
		// padding:100px 0;
	}
	.input{
		margin-top:98px ;
		padding: 0 40rpx;
	}
</style>
